import { defineStore } from 'pinia'
import { nextTick, ref } from 'vue'
import { useRouter } from 'vue-router'

// 定义一个 缓存类 状态
export const use_cache_store = defineStore(
  // 定义唯一的模块名
  'cache',
  // 传递 setup
  () => {
    const router = useRouter()
    // 获取要缓存的路由
    // 1. 在 meta 中配置 keepAlive:true
    // 2. 在 useGetKeepAlive 中 配置监听路由
    // 3. 在 vue 文件中定义 name
    let _nameList = router.options.routes.filter((_) => _?.meta?.keepAlive).map((_) => _.name) || []
    // 响应式化
    let nameList = ref(_nameList)
    function add(pathName) {
      console.log('添加缓存')
      // 不存在则添加
      if (!nameList.value.includes(pathName)) {
        nameList.value.push(pathName)
      }
    }
    function reset(pathName) {
      console.log('移除缓存')
      // 存在则移除
      if (nameList.value.includes(pathName)) {
        nameList.value.splice(nameList.value.indexOf(pathName), 1)
      }
      nextTick(() => {
        add(pathName)
      })
    }

    return {
      nameList,
      add,
      reset,
    }
  }
)
